
<!DOCTYPE html>
<html lang="en">
<head>        
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />

    <title>Icons - Aquarius - responsive admin panel</title>

    <link rel="icon" type="image/ico" href="favicon.ico"/>
    
    <link href="css/stylesheets.css" rel="stylesheet" type="text/css" />
    <link rel='stylesheet' type='text/css' href='css/fullcalendar.print.css' media='print' />
    
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js'></script>
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js'></script>
    <script type='text/javascript' src='js/plugins/jquery/jquery.mousewheel.min.js'></script>
    
    <script type='text/javascript' src='js/plugins/cookie/jquery.cookies.2.2.0.min.js'></script>
    
    <script type='text/javascript' src='js/plugins/bootstrap.min.js'></script>
    
    <script type='text/javascript' src='js/plugins/charts/jquery.flot.js'></script>    
    <script type='text/javascript' src='js/plugins/charts/jquery.flot.stack.js'></script>    
    <script type='text/javascript' src='js/plugins/charts/jquery.flot.pie.js'></script>
    <script type='text/javascript' src='js/plugins/charts/jquery.flot.resize.js'></script>
    
    <script type='text/javascript' src='js/plugins/sparklines/jquery.sparkline.min.js'></script>
    
    <script type='text/javascript' src='js/plugins/fullcalendar/fullcalendar.min.js'></script>
    
    <script type='text/javascript' src='js/plugins/select2/select2.min.js'></script>
    
    <script type='text/javascript' src='js/plugins/uniform/uniform.js'></script>
    
    <script type='text/javascript' src='js/plugins/maskedinput/jquery.maskedinput-1.3.min.js'></script>
    
    <script type='text/javascript' src='js/plugins/validation/languages/jquery.validationEngine-en.js' charset='utf-8'></script>
    <script type='text/javascript' src='js/plugins/validation/jquery.validationEngine.js' charset='utf-8'></script>
    
    <script type='text/javascript' src='js/plugins/mcustomscrollbar/jquery.mCustomScrollbar.min.js'></script>
    <script type='text/javascript' src='js/plugins/animatedprogressbar/animated_progressbar.js'></script>
    
    <script type='text/javascript' src='js/plugins/qtip/jquery.qtip-1.0.0-rc3.min.js'></script>
    
    <script type='text/javascript' src='js/plugins/cleditor/jquery.cleditor.js'></script>
    
    <script type='text/javascript' src='js/plugins/dataTables/jquery.dataTables.min.js'></script>    
    
    <script type='text/javascript' src='js/plugins/fancybox/jquery.fancybox.pack.js'></script>
    
    <script type='text/javascript' src='js/cookies.js'></script>
    <script type='text/javascript' src='js/actions.js'></script>
    <script type='text/javascript' src='js/charts.js'></script>
    <script type='text/javascript' src='js/plugins.js'></script>
    
</head>
<body>
    
    <div class="header">
        <a class="logo" href="index.html"><img src="img/logo.png" alt="Aquarius -  responsive admin panel" title="Aquarius -  responsive admin panel"/></a>
        <ul class="header_menu">
            <li class="list_icon"><a href="#">&nbsp;</a></li>
        </ul>    
    </div>
    
    <div class="menu">                
        
        <div class="breadLine">            
            <div class="arrow"></div>
            <div class="adminControl active">
                Hi, Aqvatarius
            </div>
        </div>
        
        <div class="admin">
            <div class="image">
                <img src="img/users/aqvatarius.jpg" class="img-polaroid"/>                
            </div>
            <ul class="control">                
                <li><span class="icon-comment"></span> <a href="messages.html">Messages</a> <a href="messages.html" class="caption red">12</a></li>
                <li><span class="icon-cog"></span> <a href="forms.html">Settings</a></li>
                <li><span class="icon-share-alt"></span> <a href="login.html">Logout</a></li>
            </ul>
            <div class="info">
                <span>Welcom back! Your last visit: 24.10.2012 in 19:55</span>
            </div>
        </div>
        
        <ul class="navigation">
            
            <li>
                <a href="index.html">
                    <span class="isw-grid"></span><span class="text">Dashboard</span>
                </a>
            </li>
            <li class="openable active">
                <a href="#">
                    <span class="isw-list"></span><span class="text">UI elements</span>
                </a>
                <ul>
                    <li>
                        <a href="ui.html">
                            <span class="icon-th"></span><span class="text">UI Elements</span>
                        </a>                  
                    </li>        
                    <li>
                        <a href="widgets.html">
                            <span class="icon-th-large"></span><span class="text">Widgets</span>
                        </a>                  
                    </li>
                    <li>
                        <a href="buttons.html">
                            <span class="icon-chevron-right"></span><span class="text">Buttons</span>
                        </a>                  
                    </li>   
                    <li class="active">
                        <a href="icons.html">
                            <span class="icon-fire"></span><span class="text">Icons</span>
                        </a>                  
                    </li>                      
                </ul>                
            </li>          
            <li>
                <a href="forms.html">
                    <span class="isw-archive"></span><span class="text">Forms stuff</span>                 
                </a>
            </li>                        
            <li class="openable">
                <a href="#">
                    <span class="isw-chat"></span><span class="text">Messages</span>
                </a>
                <ul>
                    <li>
                        <a href="messages.html">
                            <span class="icon-comment"></span><span class="text">Messages widgets</span></a>
                            
                            <a href="#" class="caption yellow link_navPopMessages">5</a>

                            <div id="navPopMessages" class="popup" style="display: none;">
                                <div class="head">
                                    <div class="arrow"></div>
                                    <span class="isw-chats"></span>
                                    <span class="name">Personal messages</span>
                                    <div class="clear"></div>
                                </div>
                                <div class="body messages">

                                    <div class="item">
                                        <div class="image"><a href="#"><img src="img/users/aqvatarius.jpg" class="img-polaroid"/></a></div>
                                        <div class="info">
                                            <a href="#" class="name">Aqvatarius</a>
                                            <p>Lorem ipsum dolor. In id adipiscing diam. Sed lobortis dui ut odio tempor blandit. Suspendisse scelerisque mi nec nunc gravida quis mollis lacus dignissim.</p>
                                            <span>19 feb 2012 12:45</span>
                                        </div>
                                        <div class="clear"></div>
                                    </div>

                                    <div class="item">
                                        <div class="image"><a href="#"><img src="img/users/olga.jpg" class="img-polaroid"/></a></div>
                                        <div class="info">
                                            <a href="#" class="name">Olga</a>
                                            <p>Cras nec risus dolor, ut tristique neque. Donec mauris sapien, pellentesque at porta id, varius eu tellus.</p>
                                            <span>18 feb 2012 12:45</span>
                                        </div>
                                        <div class="clear"></div>
                                    </div>                        

                                    <div class="item">
                                        <div class="image"><a href="#"><img src="img/users/dmitry.jpg" class="img-polaroid"/></a></div>
                                        <div class="info">
                                            <a href="#" class="name">Dmitry</a>
                                            <p>In id adipiscing diam. Sed lobortis dui ut odio tempor blandit.</p>
                                            <span>17 feb 2012 12:45</span>
                                        </div>
                                        <div class="clear"></div>
                                    </div>                         

                                    <div class="item">
                                        <div class="image"><a href="#"><img src="img/users/helen.jpg" class="img-polaroid"/></a></div>
                                        <div class="info">
                                            <a href="#" class="name">Helen</a>
                                            <p>Sed lobortis dui ut odio tempor blandit. Suspendisse scelerisque mi nec nunc gravida quis mollis lacus dignissim. Donec mauris sapien, pellentesque at porta id, varius eu tellus.</p>
                                            <span>15 feb 2012 12:45</span>
                                        </div>
                                        <div class="clear"></div>
                                    </div>                                  

                                </div>
                                <div class="footer">
                                    <button class="btn link_navPopMessages" type="button">Close</button>
                                </div>
                            </div>                                                                                                                          
                    </li>                                        
                </ul>                
                
   
            </li>                                    
            <li>
                <a href="statistic.html">
                    <span class="isw-graph"></span><span class="text">Statistics</span>
                </a>
            </li>                                    
            <li>
                <a href="tables.html">
                    <span class="isw-text_document"></span><span class="text">Tables</span>
                </a>
            </li>                                    
            <li class="openable">
                <a href="#">
                    <span class="isw-zoom"></span><span class="text">Other</span>                    
                </a>
                <ul>
                    <li>
                        <a href="gallery.html">
                            <span class="icon-picture"></span><span class="text">Gallery</span>
                        </a>
                    </li>
                    <li>
                        <a href="typography.html">
                            <span class="icon-pencil"></span><span class="text">Typography</span>
                        </a>
                    </li>   
                    <li>
                        <a href="users.html">
                            <span class="icon-user"></span><span class="text">Users</span>
                        </a>
                    </li>                                                                                           
                </ul>
            </li>                                              
        </ul>
               
        <div class="dr"><span></span></div>
        
        <div class="widget-fluid">
            <div id="menuDatepicker"></div>
        </div>
        
        <div class="dr"><span></span></div>

        <div class="widget">

            <div class="input-append">
                <input id="appendedInputButton" style="width: 118px;" type="text"><button class="btn" type="button">Search</button>
            </div>            
            
        </div>
        
        <div class="dr"><span></span></div>        

        <div class="widget-fluid">
            
            <div class="wBlock">
                <div class="dSpace">
                    <h3>Last visits</h3>
                    <span class="number">6,302</span>                    
                    <span>5,774 <b>unique</b></span>
                    <span>3,512 <b>returning</b></span>
                </div>
                <div class="rSpace">
                    <h3>Today</h3>
                    <span class="mChartBar" sparkType="bar" sparkBarColor="white"><!--240,234,150,290,310,240,210,400,320,198,250,222,111,240,221,340,250,190--></span>                                                                                
                    <span>&nbsp;</span>
                    <span>65% <b>New</b></span>
                    <span>35% <b>Returning</b></span>
                </div>
            </div>
            
        </div>        
        
    </div>
        
    <div class="content">
        
        
        <div class="breadLine">
            
            <ul class="breadcrumb">
                <li><a href="#">Simple Admin</a> <span class="divider">></span></li>                
                <li class="active">Icons</li>
            </ul>
                        
            <ul class="buttons">
                <li>
                    <a href="#" class="link_bcPopupList"><span class="icon-user"></span><span class="text">Users list</span></a>

                    <div id="bcPopupList" class="popup">
                        <div class="head">
                            <div class="arrow"></div>
                            <span class="isw-users"></span>
                            <span class="name">List users</span>
                            <div class="clear"></div>
                        </div>
                        <div class="body-fluid users">

                            <div class="item">
                                <div class="image"><a href="#"><img src="img/users/aqvatarius.jpg" width="32"/></a></div>
                                <div class="info">
                                    <a href="#" class="name">Aqvatarius</a>                                    
                                    <span>online</span>
                                </div>
                                <div class="clear"></div>
                            </div>

                            <div class="item">
                                <div class="image"><a href="#"><img src="img/users/olga.jpg" width="32"/></a></div>
                                <div class="info">
                                    <a href="#" class="name">Olga</a>                                
                                    <span>online</span>
                                </div>
                                <div class="clear"></div>
                            </div>                        

                            <div class="item">
                                <div class="image"><a href="#"><img src="img/users/alexey.jpg" width="32"/></a></div>
                                <div class="info">
                                    <a href="#" class="name">Alexey</a>  
                                    <span>online</span>
                                </div>
                                <div class="clear"></div>
                            </div>                              
                        
                            <div class="item">
                                <div class="image"><a href="#"><img src="img/users/dmitry.jpg" width="32"/></a></div>
                                <div class="info">
                                    <a href="#" class="name">Dmitry</a>                                    
                                    <span>online</span>
                                </div>
                                <div class="clear"></div>
                            </div>                         

                            <div class="item">
                                <div class="image"><a href="#"><img src="img/users/helen.jpg" width="32"/></a></div>
                                <div class="info">
                                    <a href="#" class="name">Helen</a>                                                                        
                                </div>
                                <div class="clear"></div>
                            </div>                                  

                            <div class="item">
                                <div class="image"><a href="#"><img src="img/users/alexander.jpg" width="32"/></a></div>
                                <div class="info">
                                    <a href="#" class="name">Alexander</a>                                                                        
                                </div>
                                <div class="clear"></div>
                            </div>                                  

                        </div>
                        <div class="footer">
                            <button class="btn" type="button">Add new</button>
                            <button class="btn btn-danger link_bcPopupList" type="button">Close</button>
                        </div>
                    </div>                    
                    
                </li>                
                <li>
                    <a href="#" class="link_bcPopupSearch"><span class="icon-search"></span><span class="text">Search</span></a>
                    
                    <div id="bcPopupSearch" class="popup">
                        <div class="head">
                            <div class="arrow"></div>
                            <span class="isw-zoom"></span>
                            <span class="name">Search</span>
                            <div class="clear"></div>
                        </div>
                        <div class="body search">
                            <input type="text" placeholder="Some text for search..." name="search"/>
                        </div>
                        <div class="footer">
                            <button class="btn" type="button">Search</button>
                            <button class="btn btn-danger link_bcPopupSearch" type="button">Close</button>
                        </div>
                    </div>                
                </li>
            </ul>
            
        </div>
        
        <div class="workplace">                                    
            
            <div class="row-fluid">
                                             
                <div class="span12">
                    <div class="head">
                        <div class="isw-cloud"></div>
                        <h1>Icons by Glyphicons(bootstrap)</h1>
                        <div class="clear"></div>
                    </div>
                    <div class="block">
                        <ul class="the-icons clearfix">
                            <li><i class="icon-glass"></i> icon-glass</li>
                            <li><i class="icon-music"></i> icon-music</li>
                            <li><i class="icon-search"></i> icon-search</li>
                            <li><i class="icon-envelope"></i> icon-envelope</li>
                            <li><i class="icon-heart"></i> icon-heart</li>
                            <li><i class="icon-star"></i> icon-star</li>
                            <li><i class="icon-star-empty"></i> icon-star-empty</li>
                            <li><i class="icon-user"></i> icon-user</li>
                            <li><i class="icon-film"></i> icon-film</li>
                            <li><i class="icon-th-large"></i> icon-th-large</li>
                            <li><i class="icon-th"></i> icon-th</li>
                            <li><i class="icon-th-list"></i> icon-th-list</li>
                            <li><i class="icon-ok"></i> icon-ok</li>
                            <li><i class="icon-remove"></i> icon-remove</li>
                            <li><i class="icon-zoom-in"></i> icon-zoom-in</li>
                            <li><i class="icon-zoom-out"></i> icon-zoom-out</li>
                            <li><i class="icon-off"></i> icon-off</li>
                            <li><i class="icon-signal"></i> icon-signal</li>
                            <li><i class="icon-cog"></i> icon-cog</li>
                            <li><i class="icon-trash"></i> icon-trash</li>
                            <li><i class="icon-home"></i> icon-home</li>
                            <li><i class="icon-file"></i> icon-file</li>
                            <li><i class="icon-time"></i> icon-time</li>
                            <li><i class="icon-road"></i> icon-road</li>
                            <li><i class="icon-download-alt"></i> icon-download-alt</li>
                            <li><i class="icon-download"></i> icon-download</li>
                            <li><i class="icon-upload"></i> icon-upload</li>
                            <li><i class="icon-inbox"></i> icon-inbox</li>

                            <li><i class="icon-play-circle"></i> icon-play-circle</li>
                            <li><i class="icon-repeat"></i> icon-repeat</li>
                            <li><i class="icon-refresh"></i> icon-refresh</li>
                            <li><i class="icon-list-alt"></i> icon-list-alt</li>
                            <li><i class="icon-lock"></i> icon-lock</li>
                            <li><i class="icon-flag"></i> icon-flag</li>
                            <li><i class="icon-headphones"></i> icon-headphones</li>
                            <li><i class="icon-volume-off"></i> icon-volume-off</li>
                            <li><i class="icon-volume-down"></i> icon-volume-down</li>
                            <li><i class="icon-volume-up"></i> icon-volume-up</li>
                            <li><i class="icon-qrcode"></i> icon-qrcode</li>
                            <li><i class="icon-barcode"></i> icon-barcode</li>
                            <li><i class="icon-tag"></i> icon-tag</li>
                            <li><i class="icon-tags"></i> icon-tags</li>
                            <li><i class="icon-book"></i> icon-book</li>
                            <li><i class="icon-bookmark"></i> icon-bookmark</li>
                            <li><i class="icon-print"></i> icon-print</li>
                            <li><i class="icon-camera"></i> icon-camera</li>
                            <li><i class="icon-font"></i> icon-font</li>
                            <li><i class="icon-bold"></i> icon-bold</li>
                            <li><i class="icon-italic"></i> icon-italic</li>
                            <li><i class="icon-text-height"></i> icon-text-height</li>
                            <li><i class="icon-text-width"></i> icon-text-width</li>
                            <li><i class="icon-align-left"></i> icon-align-left</li>
                            <li><i class="icon-align-center"></i> icon-align-center</li>
                            <li><i class="icon-align-right"></i> icon-align-right</li>
                            <li><i class="icon-align-justify"></i> icon-align-justify</li>
                            <li><i class="icon-list"></i> icon-list</li>

                            <li><i class="icon-indent-left"></i> icon-indent-left</li>
                            <li><i class="icon-indent-right"></i> icon-indent-right</li>
                            <li><i class="icon-facetime-video"></i> icon-facetime-video</li>
                            <li><i class="icon-picture"></i> icon-picture</li>
                            <li><i class="icon-pencil"></i> icon-pencil</li>
                            <li><i class="icon-map-marker"></i> icon-map-marker</li>
                            <li><i class="icon-adjust"></i> icon-adjust</li>
                            <li><i class="icon-tint"></i> icon-tint</li>
                            <li><i class="icon-edit"></i> icon-edit</li>
                            <li><i class="icon-share"></i> icon-share</li>
                            <li><i class="icon-check"></i> icon-check</li>
                            <li><i class="icon-move"></i> icon-move</li>
                            <li><i class="icon-step-backward"></i> icon-step-backward</li>
                            <li><i class="icon-fast-backward"></i> icon-fast-backward</li>
                            <li><i class="icon-backward"></i> icon-backward</li>
                            <li><i class="icon-play"></i> icon-play</li>
                            <li><i class="icon-pause"></i> icon-pause</li>
                            <li><i class="icon-stop"></i> icon-stop</li>
                            <li><i class="icon-forward"></i> icon-forward</li>
                            <li><i class="icon-fast-forward"></i> icon-fast-forward</li>
                            <li><i class="icon-step-forward"></i> icon-step-forward</li>
                            <li><i class="icon-eject"></i> icon-eject</li>
                            <li><i class="icon-chevron-left"></i> icon-chevron-left</li>
                            <li><i class="icon-chevron-right"></i> icon-chevron-right</li>
                            <li><i class="icon-plus-sign"></i> icon-plus-sign</li>
                            <li><i class="icon-minus-sign"></i> icon-minus-sign</li>
                            <li><i class="icon-remove-sign"></i> icon-remove-sign</li>
                            <li><i class="icon-ok-sign"></i> icon-ok-sign</li>

                            <li><i class="icon-question-sign"></i> icon-question-sign</li>
                            <li><i class="icon-info-sign"></i> icon-info-sign</li>
                            <li><i class="icon-screenshot"></i> icon-screenshot</li>
                            <li><i class="icon-remove-circle"></i> icon-remove-circle</li>
                            <li><i class="icon-ok-circle"></i> icon-ok-circle</li>
                            <li><i class="icon-ban-circle"></i> icon-ban-circle</li>
                            <li><i class="icon-arrow-left"></i> icon-arrow-left</li>
                            <li><i class="icon-arrow-right"></i> icon-arrow-right</li>
                            <li><i class="icon-arrow-up"></i> icon-arrow-up</li>
                            <li><i class="icon-arrow-down"></i> icon-arrow-down</li>
                            <li><i class="icon-share-alt"></i> icon-share-alt</li>
                            <li><i class="icon-resize-full"></i> icon-resize-full</li>
                            <li><i class="icon-resize-small"></i> icon-resize-small</li>
                            <li><i class="icon-plus"></i> icon-plus</li>
                            <li><i class="icon-minus"></i> icon-minus</li>
                            <li><i class="icon-asterisk"></i> icon-asterisk</li>
                            <li><i class="icon-exclamation-sign"></i> icon-exclamation-sign</li>
                            <li><i class="icon-gift"></i> icon-gift</li>
                            <li><i class="icon-leaf"></i> icon-leaf</li>
                            <li><i class="icon-fire"></i> icon-fire</li>
                            <li><i class="icon-eye-open"></i> icon-eye-open</li>
                            <li><i class="icon-eye-close"></i> icon-eye-close</li>
                            <li><i class="icon-warning-sign"></i> icon-warning-sign</li>
                            <li><i class="icon-plane"></i> icon-plane</li>
                            <li><i class="icon-calendar"></i> icon-calendar</li>
                            <li><i class="icon-random"></i> icon-random</li>
                            <li><i class="icon-comment"></i> icon-comment</li>
                            <li><i class="icon-magnet"></i> icon-magnet</li>

                            <li><i class="icon-chevron-up"></i> icon-chevron-up</li>
                            <li><i class="icon-chevron-down"></i> icon-chevron-down</li>
                            <li><i class="icon-retweet"></i> icon-retweet</li>
                            <li><i class="icon-shopping-cart"></i> icon-shopping-cart</li>
                            <li><i class="icon-folder-close"></i> icon-folder-close</li>
                            <li><i class="icon-folder-open"></i> icon-folder-open</li>
                            <li><i class="icon-resize-vertical"></i> icon-resize-vertical</li>
                            <li><i class="icon-resize-horizontal"></i> icon-resize-horizontal</li>
                            <li><i class="icon-hdd"></i> icon-hdd</li>
                            <li><i class="icon-bullhorn"></i> icon-bullhorn</li>
                            <li><i class="icon-bell"></i> icon-bell</li>
                            <li><i class="icon-certificate"></i> icon-certificate</li>
                            <li><i class="icon-thumbs-up"></i> icon-thumbs-up</li>
                            <li><i class="icon-thumbs-down"></i> icon-thumbs-down</li>
                            <li><i class="icon-hand-right"></i> icon-hand-right</li>
                            <li><i class="icon-hand-left"></i> icon-hand-left</li>
                            <li><i class="icon-hand-up"></i> icon-hand-up</li>
                            <li><i class="icon-hand-down"></i> icon-hand-down</li>
                            <li><i class="icon-circle-arrow-right"></i> icon-circle-arrow-right</li>
                            <li><i class="icon-circle-arrow-left"></i> icon-circle-arrow-left</li>
                            <li><i class="icon-circle-arrow-up"></i> icon-circle-arrow-up</li>
                            <li><i class="icon-circle-arrow-down"></i> icon-circle-arrow-down</li>
                            <li><i class="icon-globe"></i> icon-globe</li>
                            <li><i class="icon-wrench"></i> icon-wrench</li>
                            <li><i class="icon-tasks"></i> icon-tasks</li>
                            <li><i class="icon-filter"></i> icon-filter</li>
                            <li><i class="icon-briefcase"></i> icon-briefcase</li>
                            <li><i class="icon-fullscreen"></i> icon-fullscreen</li>
                        </ul>                    
                    </div>
                </div>                                
                
            </div>                
            
            <div class="dr"><span></span></div>            
            
            <div class="row-fluid">
                                             
                <div class="span12">
                    <div class="head">
                        <div class="isw-cloud"></div>
                        <h1>Small white icons</h1>
                        <div class="clear"></div>
                    </div>
                    <div class="block" style="background-color: #56799F; color: #F9F9F9;">
                        <ul class="the-icons clearfix">                            
                            <li><i class="isw-archive"></i> isw-archive</li>
                            <li><i class="isw-attachment"></i> isw-attachment</li>
                            <li><i class="isw-bookmark"></i> isw-bookmark</li>
                            <li><i class="isw-brush"></i> isw-brush</li>
                            <li><i class="isw-calc"></i> isw-calc</li>
                            <li><i class="isw-calendar"></i> isw-calendar</li>
                            <li><i class="isw-cancel"></i> isw-cancel</li>
                            <li><i class="isw-chat"></i> isw-chat</li>
                            <li><i class="isw-chats"></i> isw-chats</li>
                            <li><i class="isw-cloud"></i> isw-cloud</li>
                            <li><i class="isw-delete"></i> isw-delete</li>
                            <li><i class="isw-documents"></i> isw-documents</li>
                            <li><i class="isw-down"></i> isw-down</li>
                            <li><i class="isw-donw_circle"></i> isw-donw_circle</li>
                            <li><i class="isw-download"></i> isw-download</li>
                            <li><i class="isw-edit"></i> isw-edit</li>
                            <li><i class="isw-empty_document"></i> isw-empty_document</li>
                            <li><i class="isw-favorite"></i> isw-favorite</li>
                            <li><i class="isw-folder"></i> isw-folder</li>
                            <li><i class="isw-fullscreen"></i> isw-fullscreen</li>
                            <li><i class="isw-graph"></i> isw-graph</li>
                            <li><i class="isw-grid"></i> isw-grid</li>
                            <li><i class="isw-left"></i> isw-left</li>
                            <li><i class="isw-left_circle"></i> isw-left_circle</li>
                            <li><i class="isw-list"></i> isw-list</li>
                            <li><i class="isw-lock"></i> isw-lock</li>
                            <li><i class="isw-mail"></i> isw-mail</li>
                            <li><i class="isw-minus"></i> isw-minus</li>
                            <li><i class="isw-ok"></i> isw-ok</li>
                            <li><i class="isw-picture"></i> isw-picture</li>
                            <li><i class="isw-pin"></i> isw-pin</li>
                            <li><i class="isw-plus"></i> isw-plus</li>
                            <li><i class="isw-power"></i> isw-power</li>
                            <li><i class="isw-print"></i> isw-print</li>
                            <li><i class="isw-refresh"></i> isw-refresh</li>
                            <li><i class="isw-right"></i> isw-right</li>
                            <li><i class="isw-right_circle"></i> isw-right_circle</li>
                            <li><i class="isw-settings"></i> isw-settings</li>
                            <li><i class="isw-sound"></i> isw-sound</li>
                            <li><i class="isw-sync"></i> isw-sync</li>
                            <li><i class="isw-tag"></i> isw-tag</li>
                            <li><i class="isw-target"></i> isw-target</li>
                            <li><i class="isw-text_document"></i> isw-text_document</li>
                            <li><i class="isw-time"></i> isw-time</li>
                            <li><i class="isw-unlock"></i> isw-unlock</li>
                            <li><i class="isw-up"></i> isw-up</li>
                            <li><i class="isw-up_circle"></i> isw-up_circle</li>
                            <li><i class="isw-user"></i> isw-user</li>
                            <li><i class="isw-users"></i> isw-users</li>
                            <li><i class="isw-zoom"></i> isw-zoom</li>
                        </ul>                    
                    </div>
                </div>                                
                
            </div>            
            
            <div class="dr"><span></span></div>            
            
            <div class="row-fluid">
                                             
                <div class="span12">
                    <div class="head">
                        <div class="isw-cloud"></div>
                        <h1>Small black icons</h1>
                        <div class="clear"></div>
                    </div>
                    <div class="block">
                        <ul class="the-icons clearfix">                            
                            <li><i class="isb-archive"></i> isb-archive</li>
                            <li><i class="isb-attachment"></i> isb-attachment</li>
                            <li><i class="isb-bookmark"></i> isb-bookmark</li>
                            <li><i class="isb-brush"></i> isb-brush</li>
                            <li><i class="isb-calc"></i> isb-calc</li>
                            <li><i class="isb-calendar"></i> isb-calendar</li>
                            <li><i class="isb-cancel"></i> isb-cancel</li>
                            <li><i class="isb-chat"></i> isb-chat</li>
                            <li><i class="isb-chats"></i> isb-chats</li>
                            <li><i class="isb-cloud"></i> isb-cloud</li>
                            <li><i class="isb-delete"></i> isb-delete</li>
                            <li><i class="isb-documents"></i> isb-documents</li>
                            <li><i class="isb-down"></i> isb-down</li>
                            <li><i class="isb-donw_circle"></i> isb-donw_circle</li>
                            <li><i class="isb-download"></i> isb-download</li>
                            <li><i class="isb-edit"></i> isb-edit</li>
                            <li><i class="isb-empty_document"></i> isb-empty_document</li>
                            <li><i class="isb-favorite"></i> isb-favorite</li>
                            <li><i class="isb-folder"></i> isb-folder</li>
                            <li><i class="isb-fullscreen"></i> isb-fullscreen</li>
                            <li><i class="isb-graph"></i> isb-graph</li>
                            <li><i class="isb-grid"></i> isb-grid</li>
                            <li><i class="isb-left"></i> isb-left</li>
                            <li><i class="isb-left_circle"></i> isb-left_circle</li>
                            <li><i class="isb-list"></i> isb-list</li>
                            <li><i class="isb-lock"></i> isb-lock</li>
                            <li><i class="isb-mail"></i> isb-mail</li>
                            <li><i class="isb-minus"></i> isb-minus</li>
                            <li><i class="isb-ok"></i> isb-ok</li>
                            <li><i class="isb-picture"></i> isb-picture</li>
                            <li><i class="isb-pin"></i> isb-pin</li>
                            <li><i class="isb-plus"></i> isb-plus</li>
                            <li><i class="isb-power"></i> isb-power</li>
                            <li><i class="isb-print"></i> isb-print</li>
                            <li><i class="isb-refresh"></i> isb-refresh</li>
                            <li><i class="isb-right"></i> isb-right</li>
                            <li><i class="isb-right_circle"></i> isb-right_circle</li>
                            <li><i class="isb-settings"></i> isb-settings</li>
                            <li><i class="isb-sound"></i> isb-sound</li>
                            <li><i class="isb-sync"></i> isb-sync</li>
                            <li><i class="isb-tag"></i> isb-tag</li>
                            <li><i class="isb-target"></i> isb-target</li>
                            <li><i class="isb-text_document"></i> isb-text_document</li>
                            <li><i class="isb-time"></i> isb-time</li>
                            <li><i class="isb-unlock"></i> isb-unlock</li>
                            <li><i class="isb-up"></i> isb-up</li>
                            <li><i class="isb-up_circle"></i> isb-up_circle</li>
                            <li><i class="isb-user"></i> isb-user</li>
                            <li><i class="isb-users"></i> isb-users</li>
                            <li><i class="isb-zoom"></i> isb-zoom</li>
                        </ul>                    
                    </div>
                </div>                                
                
            </div>            
            
            <div class="dr"><span></span></div>            
            
            <div class="row-fluid">
                                             
                <div class="span12">
                    <div class="head">
                        <div class="isw-cloud"></div>
                        <h1>Big white icons</h1>
                        <div class="clear"></div>
                    </div>
                    <div class="block" style="background-color: #56799F; color: #F9F9F9;">
                        <ul class="the-icons clearfix">                            
                            <li><i class="ibw-archive"></i> ibw-archive</li>
                            <li><i class="ibw-attachment"></i> ibw-attachment</li>
                            <li><i class="ibw-bookmark"></i> ibw-bookmark</li>
                            <li><i class="ibw-brush"></i> ibw-brush</li>
                            <li><i class="ibw-calc"></i> ibw-calc</li>
                            <li><i class="ibw-calendar"></i> ibw-calendar</li>
                            <li><i class="ibw-cancel"></i> ibw-cancel</li>
                            <li><i class="ibw-chat"></i> ibw-chat</li>
                            <li><i class="ibw-chats"></i> ibw-chats</li>
                            <li><i class="ibw-cloud"></i> ibw-cloud</li>
                            <li><i class="ibw-delete"></i> ibw-delete</li>
                            <li><i class="ibw-documents"></i> ibw-documents</li>
                            <li><i class="ibw-down"></i> ibw-down</li>
                            <li><i class="ibw-donw_circle"></i> ibw-donw_circle</li>
                            <li><i class="ibw-download"></i> ibw-download</li>
                            <li><i class="ibw-edit"></i> ibw-edit</li>
                            <li><i class="ibw-empty_document"></i> ibw-empty_document</li>
                            <li><i class="ibw-favorite"></i> ibw-favorite</li>
                            <li><i class="ibw-folder"></i> ibw-folder</li>
                            <li><i class="ibw-fullscreen"></i> ibw-fullscreen</li>
                            <li><i class="ibw-graph"></i> ibw-graph</li>
                            <li><i class="ibw-grid"></i> ibw-grid</li>
                            <li><i class="ibw-left"></i> ibw-left</li>
                            <li><i class="ibw-left_circle"></i> ibw-left_circle</li>
                            <li><i class="ibw-list"></i> ibw-list</li>
                            <li><i class="ibw-lock"></i> ibw-lock</li>
                            <li><i class="ibw-mail"></i> ibw-mail</li>
                            <li><i class="ibw-minus"></i> ibw-minus</li>
                            <li><i class="ibw-ok"></i> ibw-ok</li>
                            <li><i class="ibw-picture"></i> ibw-picture</li>
                            <li><i class="ibw-pin"></i> ibw-pin</li>
                            <li><i class="ibw-plus"></i> ibw-plus</li>
                            <li><i class="ibw-power"></i> ibw-power</li>
                            <li><i class="ibw-print"></i> ibw-print</li>
                            <li><i class="ibw-refresh"></i> ibw-refresh</li>
                            <li><i class="ibw-right"></i> ibw-right</li>
                            <li><i class="ibw-right_circle"></i> ibw-right_circle</li>
                            <li><i class="ibw-settings"></i> ibw-settings</li>
                            <li><i class="ibw-sound"></i> ibw-sound</li>
                            <li><i class="ibw-sync"></i> ibw-sync</li>
                            <li><i class="ibw-tag"></i> ibw-tag</li>
                            <li><i class="ibw-target"></i> ibw-target</li>
                            <li><i class="ibw-text_document"></i> ibw-text_document</li>
                            <li><i class="ibw-time"></i> ibw-time</li>
                            <li><i class="ibw-unlock"></i> ibw-unlock</li>
                            <li><i class="ibw-up"></i> ibw-up</li>
                            <li><i class="ibw-up_circle"></i> ibw-up_circle</li>
                            <li><i class="ibw-user"></i> ibw-user</li>
                            <li><i class="ibw-users"></i> ibw-users</li>
                            <li><i class="ibw-zoom"></i> ibw-zoom</li>
                        </ul>                    
                    </div>
                </div>                                
                
            </div>            
            
            <div class="dr"><span></span></div>            
            
            <div class="row-fluid">
                                             
                <div class="span12">
                    <div class="head">
                        <div class="isw-cloud"></div>
                        <h1>Big black icons</h1>
                        <div class="clear"></div>
                    </div>
                    <div class="block">
                        <ul class="the-icons clearfix">                            
                            <li><i class="ibb-archive"></i> ibb-archive</li>
                            <li><i class="ibb-attachment"></i> ibb-attachment</li>
                            <li><i class="ibb-bookmark"></i> ibb-bookmark</li>
                            <li><i class="ibb-brush"></i> ibb-brush</li>
                            <li><i class="ibb-calc"></i> ibb-calc</li>
                            <li><i class="ibb-calendar"></i> ibb-calendar</li>
                            <li><i class="ibb-cancel"></i> ibb-cancel</li>
                            <li><i class="ibb-chat"></i> ibb-chat</li>
                            <li><i class="ibb-chats"></i> ibb-chats</li>
                            <li><i class="ibb-cloud"></i> ibb-cloud</li>
                            <li><i class="ibb-delete"></i> ibb-delete</li>
                            <li><i class="ibb-documents"></i> ibb-documents</li>
                            <li><i class="ibb-down"></i> ibb-down</li>
                            <li><i class="ibb-donw_circle"></i> ibb-donw_circle</li>
                            <li><i class="ibb-download"></i> ibb-download</li>
                            <li><i class="ibb-edit"></i> ibb-edit</li>
                            <li><i class="ibb-empty_document"></i> ibb-empty_document</li>
                            <li><i class="ibb-favorite"></i> ibb-favorite</li>
                            <li><i class="ibb-folder"></i> ibb-folder</li>
                            <li><i class="ibb-fullscreen"></i> ibb-fullscreen</li>
                            <li><i class="ibb-graph"></i> ibb-graph</li>
                            <li><i class="ibb-grid"></i> ibb-grid</li>
                            <li><i class="ibb-left"></i> ibb-left</li>
                            <li><i class="ibb-left_circle"></i> ibb-left_circle</li>
                            <li><i class="ibb-list"></i> ibb-list</li>
                            <li><i class="ibb-lock"></i> ibb-lock</li>
                            <li><i class="ibb-mail"></i> ibb-mail</li>
                            <li><i class="ibb-minus"></i> ibb-minus</li>
                            <li><i class="ibb-ok"></i> ibb-ok</li>
                            <li><i class="ibb-picture"></i> ibb-picture</li>
                            <li><i class="ibb-pin"></i> ibb-pin</li>
                            <li><i class="ibb-plus"></i> ibb-plus</li>
                            <li><i class="ibb-power"></i> ibb-power</li>
                            <li><i class="ibb-print"></i> ibb-print</li>
                            <li><i class="ibb-refresh"></i> ibb-refresh</li>
                            <li><i class="ibb-right"></i> ibb-right</li>
                            <li><i class="ibb-right_circle"></i> ibb-right_circle</li>
                            <li><i class="ibb-settings"></i> ibb-settings</li>
                            <li><i class="ibb-sound"></i> ibb-sound</li>
                            <li><i class="ibb-sync"></i> ibb-sync</li>
                            <li><i class="ibb-tag"></i> ibb-tag</li>
                            <li><i class="ibb-target"></i> ibb-target</li>
                            <li><i class="ibb-text_document"></i> ibb-text_document</li>
                            <li><i class="ibb-time"></i> ibb-time</li>
                            <li><i class="ibb-unlock"></i> ibb-unlock</li>
                            <li><i class="ibb-up"></i> ibb-up</li>
                            <li><i class="ibb-up_circle"></i> ibb-up_circle</li>
                            <li><i class="ibb-user"></i> ibb-user</li>
                            <li><i class="ibb-users"></i> ibb-users</li>
                            <li><i class="ibb-zoom"></i> ibb-zoom</li>
                        </ul>                    
                    </div>
                </div>                                
                
            </div>             
            
            
        </div>
        
    </div>   

</body>
</html>